define(['jquery','medicine'],()=>{
    var str = '';
    blood_data.forEach((item)=>{
        str += `
        <li>
        <a href="#">
            <div class="img">
                <img src="${item.blood_data_src}" alt="" data-id="${item.blood_data_id}">
                <p class="the_pin">${item.blood_data_the_pin}</p>
            </div>
            <div class="title">
                ${item.blood_data_title}
            </div>
            <div class="desc">${item.blood_data_desc}</div>
            <div class="price">
                <p class="price_1">￥<span>${item.blood_data_price_1}</span></p>
                <p class="price_2">￥<span>${item.blood_data__price_2}</span></p>
            </div>
        </a>
        </li>
        `
    })
    $('.blood_ul').eq(0).html(str);
    str = null
    // 第二个ul
    var str = '';
    blood_data_2.forEach((item) =>{
        str +=`
            <li>
             <a href="#">
            <div class="img">
                <img src="${item.blood_data_src}" alt="" data-id="${item.blood_data_id}">
                <p class="the_pin">${item.blood_data_the_pin}</p>
            </div>
            <div class="title">
                ${item.blood_data_title}
            </div>
            <div class="desc">${item.blood_data_desc}</div>
            <div class="price">
                <p class="price_1">￥<span>${item.blood_data_price_1}</span></p>
                <p class="price_2">￥<span>${item.blood_data__price_2}</span></p>
            </div>
        </a>
        </li>

        `
    })
    $('.blood_ul').eq(1).html(str);
    str = null
    var str = ''
    blood_data_3.forEach(item =>{
        str += `
        <li>
        <a href="#">
        <div class="img">
           <img src="${item.blood_data_src}" alt="" data-id="${item.blood_data_id}">
           <p class="the_pin">${item.blood_data_the_pin}</p>
        </div>
        <div class="title">
           ${item.blood_data_title}
        </div>
        <div class="desc">${item.blood_data_desc}</div>
        <div class="price">
           <p class="price_1">￥<span>${item.blood_data_price_1}</span></p>
           <p class="price_2">￥<span>${item.blood_data__price_2}</span></p>
        </div>
        </a>
        </li>
        `
    })
    $('.blood_ul').eq(2).html(str)
    str = null;

    // 成人生计
    var str = ''
    blood_data_4.forEach(item =>{
        str += `
        <li>
        <a href="#">
        <div class="img">
           <img src="${item.blood_data_src}" alt="" data-id="${item.blood_data_id}">
           <p class="the_pin">${item.blood_data_the_pin}</p>
        </div>
        <div class="title">
           ${item.blood_data_title}
        </div>
        <div class="desc">${item.blood_data_desc}</div>
        <div class="price">
           <p class="price_1">￥<span>${item.blood_data_price_1}</span></p>
           <p class="price_2">￥<span>${item.blood_data__price_2}</span></p>
        </div>
        </a>
        </li>
        `
    })
    $('.blood_ul').eq(3).html(str)
    str = null;

    // 体检疫苗
    var str = ''
    blood_data_5.forEach(item =>{
        str += `
        <li>
        <a href="#">
        <div class="img">
           <img src="${item.blood_data_src}" alt="" data-id="${item.blood_data_id}">
           <p class="the_pin">${item.blood_data_the_pin}</p>
        </div>
        <div class="title">
           ${item.blood_data_title}
        </div>
        <div class="desc">${item.blood_data_desc}</div>
        <div class="price">
           <p class="price_1">￥<span>${item.blood_data_price_1}</span></p>
           <p class="price_2">￥<span>${item.blood_data__price_2}</span></p>
        </div>
        </a>
        </li>
        `
    })
    $('.blood_ul').eq(4).html(str)
    str = null;
    let main = document.querySelector('#main');
    let sidebar = document.querySelector('#sidebar');

    // 侧栏
    window.onscroll = function(e){
        var e = e || window.event;
        let t = document.documentElement.scrollTop || document.body.scrollTop;
        if(t>main.offsetTop){
            sidebar.style.position = 'fixed';
            sidebar.style.top = 800 - main.offsetTop + 'px'
        }else{
            sidebar.style.position = 'absolute';
            sidebar.style.top = 800 + 'px'
        }
    }
    $('#sidebar ul li').click(function(){
        $('html').animate({
            scrollTop: $('.blood').eq($(this).index()).offset().top
        },500)
    })
    $('#sidebar ul .six').click(function(){
         $('html').animate({
            scrollTop:0
         },1000)
     })
});